<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>HTML-CSS 联系</title>

  <style>
      body {
          position: absolute;
          right: 50%;
      }

      ol li {
          color: #18b566;
      }

      #myId li {
          font-size: 18px;
          align-content: center;
          text-decoration: underline;
      }

      .my-id li {
          font-size: 18px;
          align-content: center;
          text-decoration: underline;
      }

      div > a {
          text-decoration: none;
          color: #1890ff;
      }

      #bj-div, #bj-p {

          color: #52c41a;
          text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
      }

      /*a:link{选择所有未被访问的链接}*/
      /*a:visited{选择所有已被访问链接}*/
      #xm a {
          width: 230px;
          height: 40px;
          display: block;
          background-color: #55585a;
          font-size: 14px;
          color: #fff;
          text-decoration: none;
          text-indent: 2em;
          line-height: 40px;
      }

      #xm a:hover {
          background-color: #ff6700;
      }


  </style>

</head>
<body>

<ol>
  <li>one</li>
  <li>two</li>
  <li>three</li>
</ol>

<ul class="my-id">
  <li>ul-one</li>
  <li>ul-two</li>
  <li>ru-three</li>
</ul>

<div>
  <a href="#">链接1</a>
  <p>
    <a href="#">链接</a>
  </p>
</div>

<div id="bj-div">AA</div>
<p id="bj-p">BB</p>
<span>CC</span>
<ul>
  <li>DD</li>
</ul>

<div id="xm">
  <a href="#">手机 电话卡</a>
  <a href="#">电视 盒子</a>
  <a href="#">笔记本 平板</a>
  <a href="#">出行 穿戴</a>
  <a href="#">智能 路由器</a>
  <a href="#">健康 儿童</a>
</div>



</body>
</html>